<%--%----%>
<%--Created by IntelliJ IDEA.--%>
<%--User: jiangzhenzhen--%>
<%--Date: 2018/7/18--%>
<%--Time: 15:18--%>
<%--To change this template use File | Settings | File Templates.--%>
<%--&ndash;%&gt;--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/jsp/component/common.jsp" %>

<html>
<head>
    <title>骨松管理-骨松档案-病人信息</title>
    <%--<%@ include file="/WEB-INF/jsp/component/commonBottom.jsp" %>--%>
    <script src="${assets}/js/views/vue.min.js"></script>
    <link rel="stylesheet" href="${frames}/css/lib/bootstrap.min.css" type="text/css">
    <%--<link rel="stylesheet" href="${frames}/css/lib/dataTables.bootstrap.css" type="text/css">--%>
    <%@ include file="/WEB-INF/jsp/component/commonBottom.jsp" %>
    <script type="text/javascript" src="${assets}/js/echarts.js"></script>
    <link rel="stylesheet" href="${frames}/css/paginate.css" type="text/css">
    <script src="${js}/jquery-1.9.1.min.js"></script>
    <link href="${assets}/css/bootstrap-datetimepicker.css" type="text/css">
    <script src="${assets}/js/bootstrap-datetimepicker.min.js"></script>
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="${assets}/css/bootstrapDatepickr-1.0.0.css">
    <script src="${assets}/js/bootstrapDatepickr-1.0.0.min.js"></script>
    <%--<link rel="stylesheet" href="${frames}/css/lib/dataTables.bootstrap.css" type="text/css">--%>
    <%--<link rel="stylesheet" href="${frames}/css/paginate.css" type="text/css">--%>
    <%--<link rel="stylesheet" href="${newframe}/css/base/base.css" type="text/css">--%>
    <%--<link rel="stylesheet" href="${frames}/css/table.css" type="text/css">--%>
    <link rel="stylesheet" href="${frames}/css/qulitity.css" type="text/css">
    <%--<link rel="stylesheet" href="../assets/css/views/modules/_common.scss">--%>
    <%--<link rel="stylesheet" href="${frames}/css/qulitity.css" type="text/css" type="text/css">--%>
    <%--<script src="${assets}/js/views/bpAbnormal.js"></script>--%>
    <link rel="stylesheet" href="${assets}/css/views/modules/_common.scss">
    <link rel="stylesheet" href="${assets}/css/views/archives/pArchives.css">
    <link rel="stylesheet" href="${assets}/css/views/department/departmentMgr.css">
    <script src="${frames}/Chronic/laydate/laydate.js"></script>
    <script src="${js}/jquery.dataTables.js"></script>
    <style>
        #tablepart5 .dataTables_paginate .current,
        #table3 .dataTables_paginate .active {
            color: #35acfd;
            cursor: default;
            background-color: #ffffff;
            border: none;
        }

        #tablepart5 .dataTables_paginate a,
        #table3 .dataTables_paginate a {
            display: inline-block;
            width: 24px;
            height: 24px;
            border: none;
            color: #333333;
            text-align: center;
        }

        #tablepart5 .pagination .active a,
        #table3 .pagination .active a {
            color: #35acfd;
            cursor: default;
            background-color: #ffffff;
            border: none;
        }

        #bpillness span {
            margin-top: 0 !important;
        }

        .feritin input {
            /*width:20px;*/
            /*height:20px;*/
            vertical-align: middle;
            margin-bottom: 7px;
            display: inline-block !important;
        }

        /*各种历史，默认隐藏*/
        .personHistory {
            display:none;
        }
        #illnessTable tr td{
            border:#ccc solid 1px;
            padding: 5px 10px;
            color:#666666;
        }
        #illnessTable tr td:first-child{
            width:22%;
        }
    </style>
</head>
<body>
<div>
    <%@ include file="../../breadline.jsp" %>
</div>
<div id="main">
    <%--    病人基本信息模块开始--%>
    <div style="padding-bottom:20px;background-color: #ffffff;box-shadow: 0 3px 7px 0 rgba(0, 0, 0, 0.05);">
        <div style="margin-left:19px;">
            <div class="first_news">
                <div class="news" style="margin-top:15px;margin-bottom:16px;">
                    <h3>病人基本信息</h3>
                    <button type="button" class="btn btn-info" @click="updateInfo()" >
                        <img src="../../../../assets/images/revise.png" alt="" style="width:16px;vertical-align: middle;">  修改
                    </button>
                    <%--                    <button :disabled="dis" id="btnText" v-if="synchronous" type="button" class="btn btn-info" @click="Synchronous($event)">{{btnText}}</button>--%>
                </div>
                <div style="display: flex;">
                    <div class="img" style="width:12%;">
                        <img src="../../../../assets/images/img1.png" alt="头像">
                    </div>
                    <div class="infor" style="width:80%;margin-left:2%;">
                        <div>
                            <span style="width:17%;">姓名: &nbsp;{{infor.realname}}</span>
                            <span style="width:15%;">性别: &nbsp;{{infor.sex}}</span>
                            <span style="width:15%;">年龄: &nbsp;{{infor.age}}</span>
                            <span style="width:22%;">出生日期: &nbsp;{{infor.birthday}}</span>
                            <span>身份证号: &nbsp;{{infor.idcard}}</span>
                        </div>
                        <div>
                            <span style="width:17%;">身高: &nbsp;{{infor.height}}cm</span>
                            <span style="width:15%;">体重: &nbsp;{{infor.weight}}kg</span>
                            <span style="width:15%;">BMI: &nbsp;{{infor.bMI}}</span>
                            <span style="width:22%;">腰围: &nbsp;{{infor.waist}}cm</span>
                            <span style="width:24%;">联系电话: &nbsp;{{infor.phone}}</span>
                        </div>
                        <div class="other">
                            <span style="width:30%;margin-right:0;vertical-align:middle">地址: &nbsp;{{infor.homeaddress}}</span>
                            <span style="width:33%;margin-right:0;vertical-align:middle">现患疾病诊断信息: &nbsp;{{infor.diseaseDiagnosis}}</span>
                            <span class="type" style="width:20%;margin-left:5%;vertical-align:middle;">
                                <p :title="infor.diseasesType" style="overflow: hidden;-webkit-line-clamp: 1;display: -webkit-box;-webkit-box-orient: vertical;">疾病类型: &nbsp;{{infor.diseaseName}}</p>
                            </span>
                        </div>
                        <div class="type" style="margin-top:13px;">
                            <b style="margin-right:5%;font-weight: 100;">建档医生: &nbsp;{{infor.doctor}}</b>
                            <b style="font-weight: 100;margin-right:5%;">建档机构: &nbsp;{{infor.hospName}}</b>
                            <b style="font-weight: 100;">备注: &nbsp;{{infor.remark}}<br/></b>
                            <b style="font-weight: 100;" id="bgRemark"></b>
                            <b style="font-weight: 100;" id="bpRemark"></b>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <%--    病人基本信息模块结束--%>
<%--    诊疗信息开始--%>
    <div class="illness" style="width:99%; margin-right:19px;">
            <div class="tableWrap" style="padding-bottom:20px;background-color: #ffffff;box-shadow: 0 3px 7px 0 rgba(0, 0, 0, 0.05);">
                <div style="margin-left:20px;">
                    <h3 style="margin-bottom:16px;font-size:20px;">诊疗信息</h3>
                    <button type="button" class="btn btn-info" @click="saveVisited()">
                        <img src="${assets}/images/revise.png" alt="" style="width:16px;vertical-align: middle;">  保存
                    </button>
                </div>
                <div style="margin-left:19px;">
                    <div class="way">
                        <span style="width:5px;padding-bottom:25px;background-color:#35acfd;display:inline-block;vertical-align:middle;margin-right:10px;"></span>
                        <span class="title">随访日期</span>
                        <div class="way_content">
                            <div style="margin-bottom:0px;">
                                <label for="">随访日期：</label>
                                <div class="input-group date form_date" data-date-format="yyyy-mm-dd" style="display:inline-block !important;width:15%;">
                                    <input id="beginDate" type="text" class="lay-date" v-model="visitedData.answerTime" readonly style="width:100% !important;">
                                </div>
                                <label for="" style="margin-left:40px;">随访方式：</label>
                                <%-- 随访方式 下拉 --%>
                                <select id="accompanyType" name="accompanyType" class="SN" v-model="visitedData.followUpWay">
                                    <medi:configOpt name="accompanyType"/>
                                </select>
                                <%--<label for="" style="margin-left:20px;">随访医师：</label>--%>
                                <%--<input type="text"  v-model="checkData.doctorName">--%>
                            </div>
                        </div>
                        <div class="way">
                            <span style="width:5px;padding-bottom:25px;background-color:#35acfd;display:inline-block;vertical-align:middle;margin-right:10px;"></span>
                            <span class="title">随诊记录</span>
                            <div class="way_content">
                                <div class="feritin fadeContainer" style="margin-top:0px;margin-bottom:0px;">
                                    <div style="width:100%;overflow:hidden;">
                                        <label for="operation" style="margin-top:5px;">目前症状：</label>
                                        <div style="display:inline-block;width:75%;margin-bottom:0px;vertical-align:top;"
                                             id="operation" ref="operation">
                                    <span class="ill1" v-for="(item,key) in currentSymptoms" :key="key">
                                        <input type="checkbox" :name="item.checkName" :checked="item.check"
                                               :value="item.id" :id="item.forId" v-model="visitedData.currentSymptoms"/>
                                        <label :for="item.forId">{{item.name}}</label>
                                    </span>
                                        </div>
                                    </div>
                                </div>
                                <div class="feritin fadeContainer">
                                    <label for="operation" style="margin-top:5px;">生活自理能力：</label>
                                        <select name="waistType" id="waistType" v-model="visitedData.selfCareAbility">
                                            <option value="">请选择</option>
                                            <option value="1">完全自理</option>
                                            <option value="2">部分自理</option>
                                            <option value="3">完全不能自理</option>
                                        </select>
                                </div>
                                <div class="feritin fadeContainer">
                                    <label for="operation" style="margin-top:5px;" >社会交往：</label>
                                    <select name="waistType" id="waistType" v-model="visitedData.socialInteraction">
                                        <option value="">请选择</option>
                                        <option value="1">基本正常</option>
                                        <option value="2">社交减少</option>
                                        <option value="3">完全丧失</option>
                                    </select>
                                </div>
                                <div class="feritin fadeContainer">
                                    <label for="operation" style="margin-top:5px;">找回方式：</label>
                                    <select name="waistType" id="waistType" v-model="visitedData.retrieveMethod">
                                        <option value="">请选择</option>
                                        <option value="1">家属寻找找回</option>
                                        <option value="2">报警找回</option>
                                        <option value="3">其他</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
<%--    诊疗信息结束--%>
</div>

<script>
  var vm = new Vue({
    el: "#main",
    data:{
      idcard:'',
      id:'',
      currentSymptoms:[
        {
          name: '记忆障碍',
          id: '1',
          forId: 'ysxjb1',
          checkName: 'currentSymptoms',
          checked: false
        },
        {
          name: '视空间障碍',
          id: '2',
          forId: 'ysxjb2',
          checkName: 'currentSymptoms',
          checked: false
        },
        {
          name: '人格障碍',
          id: '3',
          forId: 'ysxjb3',
          checkName: 'currentSymptoms',
          checked: false
        },
        {
          name: '工作、学习新知识能力下降',
          id: '4',
          forId: 'ysxjb4',
          checkName: 'currentSymptoms',
          checked: false
        },
        {
          name: '社会接触能力减退',
          id: '5',
          forId: 'ysxjb5',
          checkName: 'currentSymptoms',
          checked: false
        },
        {
          name: '原已掌握的的知识和技巧出现明显衰退',
          id: '6',
          forId: 'ysxjb6',
          checkName: 'currentSymptoms',
          checked: false
        },
        {
          name: '失语、失用、失认',
          id: '7',
          forId: 'ysxjb7',
          checkName: 'currentSymptoms',
          checked: false
        },
        {
          name: '行为和精神异常',
          id: '8',
          forId: 'ysxjb8',
          checkName: 'currentSymptoms',
          checked: false
        },
        {
          name: '情感淡漠、哭笑无常',
          id: '9',
          forId: 'ysxjb9',
          checkName: 'currentSymptoms',
          checked: false
        },
        {
          name: '言语能力丧失',
          id: '10',
          forId: 'ysxjb10',
          checkName: 'currentSymptoms',
          checked: false
        },
        {
          name: '不能完成简单的日常生活事项',
          id: '11',
          forId: 'ysxjb7',
          checkName: 'currentSymptoms',
          checked: false
        },
        {
          name: '终日无语我床',
          id: '12',
          forId: 'ysxjb8',
          checkName: 'currentSymptoms',
          checked: false
        },
        {
          name: '四肢强直或屈曲瘫痪',
          id: '13',
          forId: 'ysxjb9',
          checkName: 'currentSymptoms',
          checked: false
        },
        {
          name: '并发症（如肺部及尿路感染、压疮、全身性衰竭等）',
          id: '14',
          forId: 'ysxjb10',
          checkName: 'currentSymptoms',
          checked: false
        },
        {
          name: '其他',
          id: '15',
          forId: 'ysxjb10',
          checkName: 'currentSymptoms',
          checked: false
        }
      ],
      infor:{},
      visitedData:{
        id:'',
        idCard:'',
        answerTime:'',    //随访日期
        followUpWay:'',    //随访方式
        currentSymptoms:[],  //目前症状
        selfCareAbility:'',  //生活自理能力
        socialInteraction:'',  //社会交往
        retrieveMethod:'',     //找回方式
      }
    },
    methods:{
      getPersonalInfo(){
        let that = this;
        // 获取病人信息
        $.ajax({
          url: "${URL_PATIENT_PATIENTINFO}",
          type: 'post',
          dataType: "json",
          data: {
            idCard: that.idcard
          },
          success: function (data) {
            if(data.success){
              that.infor = data.data;
            }
          }
        })
      },
      initLayDate(id) {
        laydate({
          elem: id,
          istime: true,
          format: 'YYYY-MM-DD',
          choose: function (dates) { //选择好日期的回调
            // initTablePatient();
          }
        })
      },
      // 新增随访记录
      saveVisited(){
        var that = this;
        var url = '';
        that.visitedData.idCard	 = that.idcard;
        that.visitedData.answerTime = $('#beginDate').val();
        if(that.id == ''){
          url = '${ctx}/lose/wisdom/follow/up/save';
        }else{
          url = '${ctx}/lose/wisdom/follow/up/update';
        }
        if(that.visitedData.currentSymptoms.length == 0){
          that.visitedData.currentSymptoms = '';
        }
        $.ajax({
          url:url,
          // contentType:'application/json;charset=utf-8',
          contentType:'application/x-www-form-urlencoded',
          traditional:true,
          data: that.visitedData,
          dataType:'json',
          type:'post',
          success:function(data){
            console.log(data);
              $.ajax({
                url:"${URL_SCREENING_GETBREADLINE}",
                dataType:'json',
                type:'post',
                success:function(data){
                  var urlLib = '';
                  urlLib = JSON.parse(data.data).slice(0,urlLib.length-1);

                  $.ajax({
                    url:'${URL_SCREENING_SAVEBREADLINE}',
                    data:{
                      breadLine:JSON.stringify(urlLib)
                    },
                    dataType:'json',
                    type:'post',
                    success:function(data){
                      parent.showSrc(urlLib[urlLib.length-1].href);
                      // 刷新当前页面
                      window.parent.simpleCloseModal();
                    }
                  })
                }
              })
          }
        })
      },
      // 修改病人基本信息
      updateInfo: function () {
        let that = this;
        var add = location.search.split('?')[1].split('&')
        var type = location.search.split('?')[1].split('&')[add.length - 1].split('=')[1];

        window.parent.showNewModelIframe("${ctx}/pppatientbase/new/update?id=" + that.infor.id + '&diseasesType=' + type + '&type=' + that.Type, 800, 650);
      },
      // 回显随访的内容
      show:function(id){
        // lose/wisdom/follow/up/update
        var that = this;
        $.ajax({
          url:'${ctx}/lose/wisdom/follow/up/detail',
          // contentType:'application/json;charset=utf-8',
          contentType:'application/x-www-form-urlencoded',
          data: {
            id:id
          },
          dataType:'json',
          type:'post',
          success:function(res){
            // debugger
            const {id, idCard,answerTime,followUpWay,currentSymptoms,selfCareAbility,socialInteraction,retrieveMethod} = res.data;
            that.visitedData = {id, idCard,answerTime,followUpWay,currentSymptoms,selfCareAbility,socialInteraction,retrieveMethod};

            if(that.visitedData.currentSymptoms.length > 0){
              that.visitedData.currentSymptoms = that.visitedData.currentSymptoms.split(',');
            }else{
              that.visitedData.currentSymptoms = [];
            }

          }
        })
      },
      // 获取地址里的参数
      getParams(name){
        name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
        var regexS = "[\\?&]"+name+"=([^&#]*)";
        var regex = new RegExp( regexS );
        var results = regex.exec( window.location.href );
        if( results == null )
          return "";
        else
          return results[1];
      },
      // 当前日期
      getNowFormatDate() {
        var date = new Date();
        var seperator1 = "-";
        var year = date.getFullYear();
        var month = date.getMonth() + 1;
        var strDate = date.getDate();
        if (month >= 1 && month <= 9) {
          month = "0" + month;
        }
        if (strDate >= 0 && strDate <= 9) {
          strDate = "0" + strDate;
        }
        var currentdate = year + seperator1 + month + seperator1 + strDate;
        return currentdate;
      }
    },
    mounted(){
      this.idcard = this.getParams("idCard");
      this.id = this.getParams('id');
      this.getPersonalInfo(this.idcard);
      this.initLayDate('#beginDate');
      // 获取用药数据
      var date = this.getNowFormatDate();
      this.visitedData.answerTime = date;
      if(this.id != ''){
        this.show(this.id);
      }
    }
  })


</script>
</body>
</html>